<template>
  <div>
    <div class="wrap">
      <div class="tou">
        <router-link to="/shezhi">
          <img class="img1" src="../../assets/个人中心/1个人中心/jiantou.png"/>
        </router-link>
        <p >修改登录密码</p>
        <span>完成</span>
      </div>
      <ul>
        <li>
          <p>输入原密码:</p>
          <span>请输入原密码</span>
        </li>
        <li>
          <p>输入新密码:</p>
          <span>请输入新密码</span>
        </li>
        <li>
          <p>确认信密码:</p>
          <span>请确认新密码</span>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
  export default{
    methods:{
      xiugai:function(){
        this.$router.push("/shezhi")
      }
    }
  }
</script>

<style scoped="scoped">
  html,body{
    background: #F2F2F2;
  }
  .tou{
    width: 100%;
    height: 2.666rem;
    background: #e53e42;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .tou .img1{
    width: 0.638rem;
    top: 1rem;
    height: 1.055rem;
    position: absolute;
    left: 0.555rem;
  }
  .tou p{
    position: absolute;
    bottom: 0.972rem;
    height: 0.972rem;
    font-size: 1rem;
    letter-spacing: 0;
    color: #ffffff;
  }
  .tou span{
    position: absolute;
    right: 0.555rem;
    height: 0.805rem;
    font-size: 0.833rem;
    line-height: 1rem;
    letter-spacing: 0;
    color: #ffffff;
  }
  .wrap ul{
    width: 100%;
    height: 8.416rem;
    background: white;
  }
  ul li{
    width: 100%;
    height: 2.777rem;
    border-bottom: 1px solid #CCCCCC;
    display: flex;
    align-items: center;
    position: relative;
  }
  ul li p{
    position: absolute;
    left: 0.555rem;
    height: 0.75rem;
    font-size: 0.777rem;
    line-height: 1rem;
    letter-spacing: 0;
  }
  ul li span{
    position: absolute;
    left: 5.75rem;
    height: 0.75rem;
    font-size: 0.666rem;
    line-height: 1rem;
    letter-spacing: 0;
    color: #808080;
  }
</style>
